.element-doc {
  // button
  .demo-button {
    margin-bottom: 10px;
    &:last-child {
      margin-bottom: 0;
    }
    .bin-button-group + .bin-button-group {
      margin-left: 8px;
    }
  }
  .demo-tooltip, .demo-popover {
    .top, .bottom {
      text-align: center;
    }
    .center {
      width: 300px;
      margin: 10px auto;
      overflow: hidden;
    }
    .center-left {
      float: left;
    }
    .center-right {
      float: right;
    }
  }

  .demo-timeline {
    .time {
      font-size: 14px;
      font-weight: bold;
      margin: 0;
    }
    .content {
      padding-left: 5px;
      margin: 0;
    }
  }

  .demo-grid {
    .code-row-bg {
      background: #eeeeee;
    }
    .bin-col {
      color: #fff;
      padding: 10px 0;
      text-align: center;
      background: rgba(0, 153, 229, .8);
      &:nth-child(odd) {
        background: rgba(0, 153, 229, .5);
      }
    }
    .gutter {
      .bin-col {
        background: transparent !important;
        > div {
          color: #fff;
          padding: 10px 0;
          text-align: center;
          background: rgba(0, 153, 229, .8);
        }
      }
    }
  }
  .demo-form .bin-form {
    width: 520px;
  }
  .demo-form .demo-form-inline {
    width: auto;
  }
  .demo-transition .transition-box {
    margin-bottom: 10px;
    width: 200px;
    height: 100px;
    border-radius: 4px;
    background-color: #1089ff;
    text-align: center;
    color: #fff;
    padding: 40px 20px;
    margin-right: 20px;
    box-sizing: border-box;
    font-size: 16px;
  }

  .demo-progress .bin-progress {
    margin-bottom: 15px;
    width: 350px;
  }
  .demo-block .demo-loading {
    position: relative;
    overflow: hidden;
    display: inline-block;
    margin-right: 5px;
    width: 200px;
    height: 100px;
    border-radius: 4px;
    border: 1px solid #cecece;
  }
  .demo-badge .item {
    margin-right: 40px;
  }

  .demo-input .input-item {
    width: 300px;
    margin-right: 20px;
  }
  .demo-rate .block {
    padding: 30px 0;
    text-align: center;
    border-right: 1px solid #eff2f6;
    display: inline-block;
    width: 49%;
    box-sizing: border-box;
  }
  .demo-rate .block:last-child {
    border-right: none;
  }

  .demo-rate .demonstration {
    display: block;
    color: #8492a6;
    font-size: 14px;
    margin-bottom: 20px;
  }
  .demo-carousel-panel {
    height: 200px;
    line-height: 200px;
    text-align: center;
    color: #fff;
    font-size: 20px;
    background: #99a9bf;
  }

  .demo-scrollbar .bin-scrollbar__wrap {
    overflow-x: hidden;
  }

  .demo-menu .b-menu-vertical-demo:not(.bin-menu--collapse) {
    width: 240px;
    min-height: 400px;
  }

  .b-menu-vertical-demo.border {
    border-right: 1px solid #f0f0f0;
  }
}


